<!DOCTYPE html>
<html lang="zh-CN">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no, maximum-scale=1.0, minimum-scale=1.0" />
    <title>购物车</title>
    <link rel="stylesheet" href="./iconfont/iconfont.css" />
    <link rel="stylesheet" href="./css/common.css" />
    <link rel="stylesheet" href="./css/shopCar.css" />
  </head>
  <body>
    <!-- 头部模块 -->
    <header><h1>购物车</h1></header>

    <!-- 空模块 -->
    <div class="empty">
      <p>您的购物车是空的, 快去逛逛吧</p>
      <button>去逛逛</button>
    </div>

    <!-- 主体模块 -->
    <div class="main">
      <div class="title">
        <div class="left">共<span>5</span>件商品</div>
        <div class="right"><span class="iconfont icon-shouye"></span> <span>编辑</span></div>
      </div>

      <!-- 渲染模块 -->
      <div class="items">
        <!-- <div class="item">
          <input type="checkbox" name="checkboxs" id="" class="checkbox" />
          <img src="./images/item.jpg" alt="" />
          <div class="info">
            <h3 class="ellipsis-2">三星手机 SAMSUNG Galaxy S23 8GB+256GB 超视觉夜拍系统 超清夜景 悠雾紫 5G手机 游戏拍照旗舰机s23</h3>
            <div class="bottom">
              <div class="price">￥<span>1969.00</span></div>
              <div class="num">
                <button class="decrease">-</button>
                <span>2</span>
                <button class="add">+</button>
              </div>
            </div>
          </div>
        </div> -->
      </div>

      <!-- 固定模块 -->
      <div class="footer">
        <div class="left">
          <input type="checkbox" name="checkboxs" id="" class="checkAll" />
          <span>全选</span>
        </div>
        <div class="right">
          <span>合计: </span>
          <div class="total">￥<span>0.00</span></div>
          <button disabled class="pay">去结算</button>
        </div>
      </div>
    </div>

    <!-- 底部模块 -->
    <footer>
      <a href="./index.html">
        <span class="iconfont icon-shouye"></span>
        <p>首页</p>
      </a>
      <a href="./classify.html">
        <span class="iconfont icon-fenlei"></span>
        <p>分类</p>
      </a>
      <a href="./shopCar.html" class="active">
        <i>6</i>
        <span class="iconfont icon-gouwuche"></span>
        <p>购物车</p>
      </a>
      <a href="./my.html">
        <span class="iconfont icon-wode"></span>
        <p>我的</p>
      </a>
    </footer>
    <script src="./js/axios.js"></script>
    <script src="./js/shopCar.js"></script>
    <script>
      document.querySelector('.empty button').addEventListener('click', function () {
        location.href = './index.html'
      })

      // 添加商品到购物车

      // const token = localStorage.getItem('zhihui-token')

      // axios
      //   .post(
      //     'http://cba.itlike.com/public/index.php?s=/api/cart/add',
      //     {
      //       goodsId: 10040,
      //       goodsSkuId: '0',
      //       goodsNum: 1
      //     },
      //     {
      //       headers: {
      //         'Access-Token': token,
      //         platform: 'H5'
      //       }
      //     }
      //   )
      //   .then(({ data: res }) => console.log(res))
    </script>
  </body>
</html>
